<template>
  <div class="video-card-container">
    <div @mouseenter="showDetail=true" @mouseleave="showDetail=false" class="video-card">
      <router-link target="_blank" :to="{name:'view',params:{cid:videoInfo.cid}}"><div class="dark"></div></router-link>
      <div class="image">
        <iframe
          :src="'img.html?url='+videoInfo.image"
          frameborder="0"
          scrolling="no"
          style="width: 175px;height: 245px;"
        ></iframe>
      </div>
      <span class="vip">VIP</span>
      <!-- <div v-if="showDetail" class="video-detail">
        <div class="video-detail-ft">
          <div class="score">8.8</div>
          <div class="video-name">{{videoInfo.title}}</div>
          <div class="video-tag">
            <div class="category">
              {{videoInfo.categories[0]}} | {{videoInfo.categories[1]}}
            </div>
            <div class="actors">
              <span>{{videoInfo.star}}</span>
            </div>
          </div>
          <div class="comment-user"> comment.userName:</div>
          <div class="comment">
            comment
          </div>
          <div class="button-container">
            <div class="left-button">
              <i class="material-icons icon-button" >favorite_border</i>
            </div>
            <div class="devider"></div>
            <div class="left-button">
              <a :href="videoInfo.link" target="_blank">
                <i class="material-icons icon-button">play_circle_outline</i>
              </a>
            </div>
          </div>
        </div>
      </div>-->
    </div>
    <div class="figure-detail">
      <div class="score">8.8</div>
      <div class="name">{{videoInfo.title}}</div>
      <div class="desc">{{videoInfo.star}}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'VideoCard',
  data () {
    return {
      showDetail: false
    };
  },
  computed: {},
  methods: {
    goView (cid) {
      const { href } = this.$router.resolve({
        name: 'statistics-explain',
        params: {
          classID: id,
          examSubjectID: this.planClassData.examSubjectID,
          studentStatus: 0
        }
      });
      window.open(href, '_blank');
      this.$router.push('/view/' + cid);
    }
  },
  props: ['videoInfo']
};
</script>
<style src="./index.scss" lang="scss" scoped></style>
